<script src="/static/jquery-3.2.1.min.js">
    window.onunload(alert("yemian"))
</script>
<html>
<head>
    <title>教学器材管理</title>
    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.css"/>
    <link rel="stylesheet" href="/static/table/bootstrap-table.min.css"/>
    <script type="text/javascript" src="/static/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="/static/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="/static/table/bootstrap-table.js"></script>
    <script type="text/javascript" src="/static/table/locale/bootstrap-table-zh-CN.min.js"></script>
    <link rel="stylesheet" type="text/css" href="/static/sweetalert/sweetalert.css"/>
    <script type="text/javascript" src="/static/sweetalert/sweetalert.min.js"></script>

    <link rel="stylesheet" href="/static/date/bootstrap-datetimepicker.min.css"/>
    <script type="text/javascript" src="/static/date/Moment.js"></script>
    <script type="text/javascript" src="/static/date/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript">

        $(function () {
            $('#table').bootstrapTable({
                url: '/equipment/queryPage',
                columns: [
                    {
                        field: 'eqId',
                        title: '编号'
                    }, {
                        field: 'eqName',
                        title: '器材名称'
                    }, {
                        field: 'eqText',
                        title: '器材说明'
                    },
                    {
                        field: 'xx', title: '操作',
                        formatter: function (value, row, index) {
                            return "<a title='删除' href='javascript:del("
                                + row.eqId + ")'><span class='glyphicon glyphicon-trash'></span></a>";
                        }
                    }
                ],
                method: 'get',
                contentType: "application/x-www-form-urlencoded",
                queryParamsType: '',
                queryParams: queryParams,
                height: 360,
                pageList: [5, 10, 15],
                pageNumber: 1,
                pageSize: 5,
                pagination: true,
                sidePagination: 'server',
            });
        });

        //获取当前的条件个页面页数即使更新值
        function queryParams(afds) {
            var i = {
                "pageSize": afds.pageSize,
                "pageNumber": afds.pageNumber,
                "id": $('#eqName').val(),
            };
            return i;
        }

        //查询
        function chaxun() {
            var opt = $('#table').bootstrapTable('getOptions');
            var eqname = $('#eqname').val();
            $.getJSON("/equipment/queryPage", {
                "pageSize": opt.pageSize,
                "pageNumber": opt.pageNumber,
                "eqName": eqname
            }, function (data) {
                $("#table").bootstrapTable('load', data);
            })
        }

        function del(eqId) {
            $.post("/equipment/delete/" + eqId, {"_method": "delete"}, function (releset) {
                if (releset.code == 200) {
                    $("#dg").bootstrapTable('load', releset);
                    swal(
                        {
                            title: "删除成功",
                            type: "success",
                            timer: 1500,
                            showConfirmButton: false
                        }
                    );
                    search();
                } else {
                    swal(
                        {
                            title: "删除失败",
                            type: "warning",
                            timer: 1500,
                            showConfirmButton: false
                        }
                    )
                }
            })
        }

        //添加
        function insert() {
            $("#upname").val("");
            $("#uptext").val("");
            $('#exampleModal').modal('show');
        }


        function tianjia() {
            if (!validateAdd()) {
                return;
            }
            var name = $('#upname').val();
            var text1 = $('#uptext').val();
            $.post("/equipment/add", {"eqName": name, "eqText": text1}, function (releset) {
                alert(JSON.stringify(releset)); // {"code":403,"msg":"暂无权限操作"}
                if (releset.code == 200) {
                    $("#table").bootstrapTable('load', releset);
                    $('#exampleModal').modal('hide');
                    //新增成功之后渲染数据重写查询
                    swal("添加！", "添加成功", "success");
                    chaxun();
                } else if (releset.code == 403) {
                    swal("添加！", "添加没有权限", "error");
                } else {
                    swal("添加！", "添加失败", "error");
                }
            }, "json");
        }

        function validateAdd() {
            $("#upname").parent().find("span").remove();
            var upname = $("#upname").val().trim();
            if (upname == null || upname == "") {
                $("#upname").parent().append("<span style='color:red'>请输入器材名称</span>");
                return false;
            }
            return true;
        }
    </script>
</head>
<body background="/static/HTmoban/images/tongji4.jpg">


<div class="panel panel-default">
    <div class="panel-body">
        <form class="form-inline">
            <div class="input-group input-daterange">
                <label for="eqname" class="control-label">器材名称:</label>
                <input id="eqname" type="text" class="form-control">
            </div>
            <button onclick="chaxun()" type="button" class="btn btn-default" style="margin-top: 20px">查询</button>
            <button type="button" class="btn btn-default" style="float: right; margin-top: 20px" data-toggle="modal"
                    onclick="insert()"><span class="glyphicon glyphicon-plus"></span>添加器材
            </button>
        </form>
    </div>

</div>

<!--表格-->
<table id="table"></table>

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="updateModalLabel">器材添加</h4>
            </div>
            <div class="modal-body">
                <form>
                    <input type="hidden" id="upid">
                    <div class="form-group">
                        <label class="control-label">器材名称:</label>
                        <input type="text" class="form-control" id="upname">
                    </div>
                    <div class="form-group">
                        <label class="control-label">器材说明:</label>
                        <input type="text" class="form-control" id="uptext">
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" onclick="tianjia()">添加</button>
            </div>
        </div>
    </div>
</div>

</body>
</html>
